<template lang="html">
    <div class="myHeader">
        <div class="flex1 left">
            <i class="iconfont icon-back" v-if="hasBack" @click="back"></i>
        </div>
        <span class="flex1">{{title}}</span>
        <div class="flex1">
            <slot></slot>
        </div>
    </div>
</template>

<script>
export default {
    props: {
        title:{
            type: String,
            default: '时间块'
        },
        hasBack: {
            type: Boolean,
            default: true
        }
    },
    data(){
        return {}
    },
    methods: {
        back(){
            this.$router.go(-1)
        }
    }
}
</script>

<style lang="scss" scoped>
    .myHeader{
        font-size: .16rem;
        line-height: .40rem;
        background-color: #EEF0F6;
        text-align: center;
        border-bottom: 1px solid #D6D8DD;
        text-align: center;
        padding: 0 .1rem;
        display: flex;
        justify-content: space-between;
        .flex1{
            flex: 1;
        }
        .left{
            text-align: left;
            padding: 0 .1rem;
        }
    }
</style>
